<template>
  <view class="content">
    <view class="after-info">
      <view class="after-hade">
        <view class="after-hade-bt">申请退款</view>
        <text class="after-hade-txt">退款前建议先联系客服，沟通解决退款事宜。申请将达成并退款至你的微信账号，请您耐心等待...</text>
      </view>
      <view class="after-tel">
        <view class="after-tel-left" @click="dianhua">
          <text class="after-tel-left-h4">联系客服</text>
          <text class="after-tel-left-txt">说明情况，协商退款金额</text>
        </view>
      </view>
      <view class="after-jine">
        <view class="after-jine-left">
          <text class="after-tel-left-h4">退款金额</text>
          <input
            type="text"
            v-model="refund_amount"
            placeholder="最大金额为订单价格"
            class="after-tel-left-txt"
            style="max-width: 60%;"
          />
        </view>
        <view class="after-jine-right">￥{{data.original_amount}}</view>
      </view>
      <view class="after-shuominbg-box">
        <view class="after-shuominbg-ht">情况说明</view>
        <view class="after-shuominbg-txt">
          <textarea v-model="remark" placeholder="请简述退款情况,我们将在尽快为您处理..." />
        </view>
      </view>
      <button type="default" class="tjs-btn" @click="tijiao">提交</button>
    </view>
    <dacizinavtag :current="item_index" @click="tabClick"></dacizinavtag>
  </view>
</template>

<script>
import dacizinavtag from "@/components/dacizi-navtag/dacizi-navtag.vue";
export default {
  components: {
    dacizinavtag
  },
  data() {
    return {
      item_index: 3, // 单页面id
      data: "",
      remark: "",
      refund_amount: ""
    };
  },
  onLoad(id) {
    var than = this;
    uni.request({
      //获取订单详情
      url: getApp().globalData.http + "/order/info",
      data: {
        id: id.id
      },
      method: "post",
      header: {
        "content-type": "application/x-www-form-urlencoded",
        token: uni.getStorageSync("token")
      },
      success: res => {
        than.data = res.data.data;
      }
    });
  },
  methods: {
    tijiao() {
      if (this.data.original_amount < this.refund_amount) {
        wx.showToast({
          title: "输入金额过大",
          icon: "none",
          duration: 2000
        });
        return;
      }
      var than = this;
      uni.request({
        url: getApp().globalData.http + "/order/refund",
        data: {
          order_id: this.data.id,
          refund_amount: Number(this.refund_amount),
          remark: this.remark
        },
        method: "post",
        header: {
          token: uni.getStorageSync("token")
        },
        success: res => {
          if (res.data.code == 1) {
            wx.showToast({
              title: "提交申请成功",
              icon: "none",
              duration: 2000
            });
            setTimeout(() => {
              wx.reLaunch({
                url: "/pages/my/order"
              });
            }, 2000);
          } else {
            wx.showToast({
              title: res.data.msg,
              icon: "none",
              duration: 2000
            });
          }
        }
      });
    },
    dianhua() {
      wx.makePhoneCall({
        phoneNumber: uni.getStorageSync("jyfw").store_phone
      });
    }
  }
};
</script>
